<template>
	<view>
		<!-- #ifdef H5 -->
		<uni-nav-bar left-icon="back" @clickLeft="back" :border="false" title="收益报表"></uni-nav-bar>
		<!-- #endif -->
		<view class="box">
			<view class="box_bg">
				<view class="flex_row space_between">
					<view class="money_title">账户余额（元）</view>
					<view class="money_btn" @click="cashoutBtn">提现</view>
				</view>
				<view class="flex_row"><view class="money_num">{{data.wallet || '0.00'}}</view></view>
				<view class="flex_row space_around">
					<view class="flex_column align_items">
						<view class="count_title">累计收益</view>
						<view class="count_num">{{data.income_all || '0.00'}}</view>
					</view>
					<view class="flex_column align_items">
						<view class="count_title">本月收益</view>
						<view class="count_num">{{data.income_month || '0.00'}}</view>
					</view>
					<view class="flex_column align_items">
						<view class="count_title">本日收益</view>
						<view class="count_num">{{data.income_day || '0.00'}}</view>
					</view>
				</view>
			</view>
		</view>
		<view class="nav flex_row space_between" @click="goToCashoutOrder">
			<view class="nav_title">提现记录</view>
			<van-icon name="arrow" />
		</view>
		<view class="nav flex_column ">
			<view class="nav_title border_bottom nav_title_padding">直推订单收益</view>
			<view class="flex_row space_around">
				<view class="flex_column align_items">
					<view class="nav_num">{{data.order_direct_1 || '0.00'}}</view>
					<view class="nav_num_title">已付款订单</view>
				</view>
				<view class="flex_column align_items">
					<view class="nav_num">{{data.order_direct_2 || '0.00'}}</view>
					<view class="nav_num_title">未付款订单</view>
				</view>
				<view class="flex_column align_items">
					<view class="nav_num">{{data.order_direct_money/100 || '0.00'}}</view>
					<view class="nav_num_title">付款订单金额</view>
				</view>
			</view>
		</view>
		<view class="nav flex_column ">
			<view class="nav_title border_bottom nav_title_padding">团队订单收益</view>
			<view class="flex_row space_around">
				<view class="flex_column align_items">
					<view class="nav_num">{{data.order_indirect_1 || '0.00'}}</view>
					<view class="nav_num_title">已付款订单</view>
				</view>
				<view class="flex_column align_items">
					<view class="nav_num">{{data.order_indirect_2 || '0.00'}}</view>
					<view class="nav_num_title">未付款订单</view>
				</view>
				<view class="flex_column align_items">
					<view class="nav_num">{{data.order_indirect_money/100 || '0.00'}}</view>
					<view class="nav_num_title">付款订单金额</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import Route from '../../utils/route.js';
export default {
	data() {
		return {
			data:{},
		};
	},
	onLoad() {
		this.getDataInfo()
	},
	methods: {
		// 提现
		cashoutBtn() {
			uni.navigateTo({
				url: '../cashout/cashout'
			});
		},
		// 获取数据
		async getDataInfo(){
			this.data = await Route.income_info({
				uid :uni.getStorageSync('userInfo').uid
			})
		},
		// 提现记录
		goToCashoutOrder(){
			uni.navigateTo({
				url:'../cashout_order/cashout_order'
			})
		},
		// 返回
		back() {
			uni.navigateBack();
		}
	}
};
</script>

<style lang="scss">

.box {
	position: relative;
	top: 0;
	left: 0;
	width: 750rpx;
	background: #fff;
	padding: 33rpx 0;
	&_bg {
		background: url(https://god-mini.oss-cn-beijing.aliyuncs.com/static/income/bg.png) 0% 0% /100% 100% no-repeat;
		position: relative;
		left: 0;
		right: 0;
		padding: 0 30rpx;
		width: 626rpx;
		height: 290rpx;
		margin: auto;
		border-radius: 20rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
}

.flex_row {
	display: flex;
	flex-direction: row;
	align-items: center;
}
.flex_column {
	display: flex;
	flex-direction: column;
}
.space_between {
	justify-content: space-between;
}
.space_around {
	justify-content: space-around;
}
.align_items {
	align-items: center;
}
.money_title {
	font-size: 26rpx;
}
.money_num {
	font-size: 40rpx;
	color: red;
}
.money_btn {
	background: rgba(255, 255, 255, 0.95);
	color: #e87f2e;
	width: 133rpx;
	height: 66rpx;
	text-align: center;
	line-height: 66rpx;
	border-radius: 33rpx;
}
.count_title,
.count_num {
	font-size: 26rpx;
}
.count_title {
	margin-top: 33rpx;
}
.count_num {
	margin-top: 10rpx;
}
.nav {
	border-radius: 10rpx;
	margin: 0 auto;
	margin-top: 20rpx;
	padding: 30rpx;
	width: 626rpx;
	background: #fff;
}
.nav_title {
	font-size: 26rpx;
}
.border_bottom {
	border-bottom: 2rpx solid rgba(200, 200, 200, 0.2);
}
.nav_title_padding {
	padding-bottom: 20rpx;
}
.nav_num {
	font-size: 26rpx;
	font-weight: 900;
	margin-top: 33rpx;
}
.nav_num_title {
	font-size: 26rpx;
	color: #adadad;
	margin-top: 10rpx;
}
</style>
